<template>
	<div class="list">
		<ul>
			<li class="mt10 line" ref="tuiGuang2" @click="getTuiguangInfo">
				<i>
					<img :src="tuiguang" alt>
				</i>
				<span class>推广赚钱</span>
				<em class="iconfont icon-jinruyou"></em>
			</li>
			<li class="line" @click="toNewTask" v-show="mission">
				<i>
					<img :src="xinshou" alt>
				</i>
				<span>新手任务</span>
				<em class="iconfont icon-jinruyou"></em>
			</li>
			<li>
				<router-link to="/news/classroom">
					<i>
						<img :src="ketang" alt>
					</i>
					<span>投资课堂</span>
					<em class="iconfont icon-jinruyou"></em>
				</router-link>
			</li>
			<li class="mt10 line">
				<router-link to="/news">
					<i>
						<img :src="xiaoxi" alt>
					</i>
					<span>消息中心</span>
					<em class="iconfont icon-jinruyou"></em>
				</router-link>
			</li>
			<li class="line">
				<router-link to="/account/balance">
					<i>
						<img :src="zijin" alt>
					</i>
					<span>资金明细</span>
					<em class="iconfont icon-jinruyou"></em>
				</router-link>
			</li>
			<li class="line">
				<router-link to="/account/bindbank">
					<i>
						<img :src="ka" alt>
					</i>
					<span>银行卡管理</span>
					<em class="iconfont icon-jinruyou"></em>
				</router-link>
			</li>
			<li class="line">
				<router-link to="/user/info">
					<i>
						<img :src="geren" alt>
					</i>
					<span>个人信息</span>
					<em class="iconfont icon-jinruyou"></em>
				</router-link>
			</li>
			<li class="line">
				<router-link to="/user/feedback">
					<i>
						<img :src="yonghu" alt>
					</i>
					<span>用户反馈</span>
					<em class="iconfont icon-jinruyou"></em>
				</router-link>
			</li>
			<li class="line">
				<a :href="system==='ios'?this.channelInfo.iosUrl:this.channelInfo.androidUrl">
					<i>
						<img :src="geige" alt>
					</i>
					<span>给个好评</span>
					<em class="iconfont icon-jinruyou"></em>
				</a>
			</li>
			<li class="line">
				<router-link to="/service">
					<i>
						<img :src="lianxi" alt>
					</i>
					<span>联系我们</span>
					<em class="iconfont icon-jinruyou"></em>
				</router-link>
			</li>
		</ul>
	</div>
</template>
<script>
import { userUserFindPromoterCode } from '@api/user.js'
import { mapState } from 'vuex'
export default {
	name: 'list',
	data() {
		return {
			tuiguang: './static/imgs/tuiguang.svg',
			xinshou: './static/imgs/xinshou.svg',
			ketang: './static/imgs/ketang.svg',
			xiaoxi: './static/imgs/xiaoxi.svg',
			zijin: './static/imgs/zijin.svg',
			ka: './static/imgs/ka.svg',
			geren: './static/imgs/geren.svg',
			yonghu: './static/imgs/yonghu.svg',
			geige: './static/imgs/geige.svg',
			lianxi: './static/imgs/lianxi.svg',
			isIos: false
		}
	},
	props: {
		userInfo: {
			type: Object,
			required: true,
			default: {}
		},
		mission: {
			type: Number,
			required: true,
			default: 0
		},
		channelInfo: {
			type: Object,
			required: true,
			default: {}
		},
		system: {
			type: String,
			required: true,
			default: ''
		}
	},
	mounted() {
		//环境检测
		const agent = navigator.userAgent
		const isAndroid = agent.indexOf('Android') > -1 || agent.indexOf('Adr') > -1 //android终端
		const isIos = !!agent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) //ios终端
		const isIosNative = agent.toLowerCase().indexOf('safari') <= -1
		if (isIos) {
			this.isIos = true
		}
		this.hideTuiGuang()
	},
	computed: {
		...mapState(['agentStatus'])
	},
	methods: {
		toNewTask() {
			if (this.userInfo.userPhone) {
				this.$router.push({
					path: '/activity/newTask'
				})
			} else {
				this.$router.push({
					path: '/login'
				})
			}
		},
		hideTuiGuang: function() {
			var t = this,
				e = window.location.origin
			;['dl5.', 'dl9.', 'dl13.', 'gf7.', 'gf8.', 'hqjt.'].forEach(function(s, i) {
				e.includes(s) && (t.$refs.tuiGuang2.style.display = 'none')
			})
		},
		getTuiguangInfo() {
			console.log('agentStatus-->', this.agentStatus)
			if (this.agentStatus === 503) {
				this.$router.push({ path: '/login' })
			} else if (this.agentStatus === 200) {
				this.$router.push({ path: '/activity/tuiguang' })
			} else if (this.agentStatus === 600) {
				MessageBox.confirm('', {
					title: '推广赚钱',
					message: '您还不是推广员，是否要成为推广员?',
					confirmButtonText: '申请',
					confirmButtonClass: 'red'
				}).then(() => {
					this.applyTuiGuang()
				})
			}
		},
		applyTuiGuang() {
			Indicator.open({
				text: '申请中...',
				spinnerType: 'fading-circle'
			})
			axios({
				methods: 'get',
				url: '/user/user/toBePromoter.do',
				params: {}
			}).then(res => {
				Indicator.close()
				res = res.data
				if (res.code === 200) {
					Toast(res.msg)
					this.$router.push({
						path: '/activity/tuiguang'
					})
				} else {
					Toast(res.msg)
				}
			})
		}
	}
}
</script>
<style scoped lang='scss'>
.list ul li {
	background-color: #fff;
	line-height: rem(50px);
	text-align: left;
}

.list ul li > a {
	display: block;
}

.list ul li i {
	float: left;
	width: rem(30px);
	text-align: center;
	margin-left: rem(20px);
}

.list ul li span {
	margin-left: rem(13px);
	font-size: rem(14px);
	color: #222;
}

.list ul li em {
	float: right;
	margin-right: rem(15px);
	color: #bebebe;
	font-size: rem(12px);
}

.list ul li img {
	margin-top: rem(-3px);
}

.line {
	border-bottom: 1px solid #f9f9fa;
}
</style>